<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/js/jquery.js"></script>
</head>
<body>
    <h1>asdasdasdasd</h1>
    <form>
        <input type="text" name = "name" id="name">
        <input type="text" name = "age" id ="age">
        <input type="text" name ="gender" id="gender">
        <input type="button" name="save" value="保存" id="save">
    </form>

    <table id="tb">
        <thead>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        </thead>
    </table>

    <script>
        function save(){
            let name = $('#name').val()
            let age = $('#age').val()
            let gender = $('#gender').val()
            $.post("/user/add",{
                name:name,
                age:age,
                gender:gender
            },function (res){
                if (res=="ok"){
                    let tb = $('#tb')
                    let name =$('#name').val()
                    let age = $('#age').val()
                    let gender=$('#gender').val()
                    let html = "<tr>"+
                        "<td>"+name+"</td>"+
                        "<td>"+age+"</td>"+
                        "<td>"+gender+"</td>"+
                        "</tr>"
                    tb.append(html);
                }
            })
        }

        function search(){
            $.get("/user/search",{},function (res){
                console.log("zhixingle")
                let tb = $('#tb')
                for (let i = 0; i < res.length; i++) {
                    let name = res[i].name;
                    let age = res[i].age;
                    let gender = res[i].gender;
                    console.log(name,age,gender)
                    let html = "<tr>"+
                        "<td>"+name+"</td>"+
                        "<td>"+age+"</td>"+
                        "<td>"+gender+"</td>"+
                        "</tr>"
                    tb.append(html);
                }

            })
        }


        $(function (){
            $('#save').click(function (){
                save();
            })
            search()


        })
    </script>
</body>
</html>